<template>
  <div>
    <van-nav-bar
  title="问答"
  left-arrow
  @click-left="onClickLeft"
/>
<div class="box">
  <div class="left">
    <p>作为IT行业的过来人，你有什么话想对后辈说的？</p>
    <span>赞同 1000+</span>
    <span>评论 500+</span>
    <span>1小时前</span>
  </div>
  <div class="right">
    <img src="@/assets/tp.jpg" alt="">
  </div>
</div><div class="box">
  <div class="left">
    <p>作为IT行业的过来人，你有什么话想对后辈说的？</p>
    <span>赞同 1000+</span>
    <span>评论 500+</span>
    <span>1小时前</span>
  </div>
  <div class="right">
    <img src="@/assets/tp.jpg" alt="">
  </div>
</div><div class="box">
  <div class="left">
    <p>作为IT行业的过来人，你有什么话想对后辈说的？</p>
    <span>赞同 1000+</span>
    <span>评论 500+</span>
    <span>1小时前</span>
  </div>
  <div class="right">
    <img src="@/assets/tp.jpg" alt="">
  </div>
</div><div class="box">
  <div class="left">
    <p>作为IT行业的过来人，你有什么话想对后辈说的？</p>
    <span>赞同 1000+</span>
    <span>评论 500+</span>
    <span>1小时前</span>
  </div>
  <div class="right">
    <img src="@/assets/tp.jpg" alt="">
  </div>
</div><div class="box">
  <div class="left">
    <p>作为IT行业的过来人，你有什么话想对后辈说的？</p>
    <span>赞同 1000+</span>
    <span>评论 500+</span>
    <span>1小时前</span>
  </div>
  <div class="right">
    <img src="@/assets/tp.jpg" alt="">
  </div>
</div>

  </div>
</template>

<script>
import {Toast} from 'vant'
export default {
 methods: {
    onClickLeft() {
      Toast('返回');
    },
  }
}
</script>

<style scoped>
.box{
  display: flex;
  height: 60px;
  margin-bottom: 50px;
}
.left{
  width: 80%;
  padding:8px 16px;
}
.right{
  padding: 12px;
line-height: 80px;
}
img{
  width: 120px;
  height: 80px;
  margin-top: 16px;
}
span{
  color: #bbb;
  font-size: 12px;
  display: inline-block;
  margin-right: 12px;
}
</style>